import { AudioType, BtnColor, explainContent, explainType, ListenEventType, PopupType, TouchEventType } from "../../util/defineConfig";
import { nodeTouchStart } from "../../util/utilBase";
import View from "../../util/View";
import gamePanel from "./gamePanel";

const {ccclass, property} = cc._decorator;

@ccclass
export default class PopupPanel extends View {

    private gamePanel:gamePanel = null
    private view:any = null
    private index:number = 0
    private cardArr:cc.SpriteFrame[] = []       //获取的对应卡牌
    private type:PopupType = null

    private explainIndex:explainType = explainType.normal       //当前的说明序号

   init(gamePanel:gamePanel,type:PopupType){
    this.view = this.load_all_object(this.node,'')
    this.gamePanel = gamePanel
    this.type = type
    //选择颜色面板
    if(type === PopupType.selectColor){
        this.view['select_color_panel'].active = true
        nodeTouchStart(this.view['select_color_panel/btnWrapper/_oButBlue'],()=>{
            this.setSelectColor(BtnColor.blue)
        },this)
        nodeTouchStart(this.view['select_color_panel/btnWrapper/_oButRed'],()=>{
            this.setSelectColor(BtnColor.red)
        },this)
        nodeTouchStart(this.view['select_color_panel/btnWrapper/_oButYellow'],()=>{
            this.setSelectColor(BtnColor.yellow)
        },this)
        nodeTouchStart(this.view['select_color_panel/btnWrapper/_oButGreen'],()=>{
            this.setSelectColor(BtnColor.green)
        },this)
    }
     // 重新开始游戏
    else if(type === PopupType.selectRestart){
        this.view['center_panel'].active = true
         nodeTouchStart(this.view['center_panel/yes'],this.restartGame.bind(this),this)
        nodeTouchStart(this.view['center_panel/no'],()=>{
            this.emit(ListenEventType.PLAY_EFFECT,AudioType.press_button)
            this.closePanel()
        },this)
    }
    //游戏说明面板
    else if(type === PopupType.explain){
        this.view['msg_box'].active = true
    }
    else{
        this.view['inf'].active = true
        this.view['mask'].on(TouchEventType.touchStart,()=>{
       this.emit(ListenEventType.PLAY_EFFECT,AudioType.press_button)
            this.closePanel()
        },this)
    }
   }

   start(){
        if(this.type === PopupType.explain){
        this.setArrowState(explainType.normal)
        this.view['msg_box/cardPos/card'].active = true
        this.emit(ListenEventType.GET_CARD_SPRITEFRAME_BY_TYPE,this.explainIndex)
        this.view['msg_box/cardPos/tip'].getComponent(cc.Label).string = this.getExplain(this.explainIndex)
        if(this.cardArr.length>1){
            this.schedule(this.changeCard,0.5,cc.macro.REPEAT_FOREVER,0)
        }else{
            this.view['msg_box/cardPos/card'].getComponent(cc.Sprite).spriteFrame = this.cardArr[0]
        }
        nodeTouchStart(this.view['msg_box/right_arrow'],()=>{this.turnExplain('right')},this)
        nodeTouchStart(this.view['msg_box/left_arrow'],()=>{this.turnExplain('left')},this)
        nodeTouchStart(this.view['msg_box/but_skip'],()=>{
            this.gamePanel.initCard()
            this.closePanel()
        },this)
        }

   }

//    按照箭头变换卡牌和说明文本
   private turnExplain(pos:string){
    this.unscheduleAllCallbacks()
    let posX = 0
    if(pos == 'right'){
        this.explainIndex++
        posX = -350
    }else{
        this.explainIndex--
        posX = 150
    }
     cc.tween(this.view['msg_box/cardPos']).to(0.3,{x:posX,opacity:0}).call(()=>{
        this.emit(ListenEventType.GET_CARD_SPRITEFRAME_BY_TYPE,this.explainIndex)
        this.setArrowState(this.explainIndex)
        if(this.explainIndex === explainType.unoBtn){
            this.view['msg_box/cardPos/card'].active = false
            this.view['msg_box/cardPos/but_uno'].active = true
             this.view['msg_box/cardPos/tip'].getComponent(cc.Label).string = this.getExplain(this.explainIndex)
        }else{
            this.view['msg_box/cardPos/card'].active = true
            this.view['msg_box/cardPos/but_uno'].active = false
             this.view['msg_box/cardPos/tip'].getComponent(cc.Label).string = this.getExplain(this.explainIndex)
             if(this.cardArr.length>1){
                this.schedule(this.changeCard,0.5,cc.macro.REPEAT_FOREVER,0)
            }else{
                this.view['msg_box/cardPos/card'].getComponent(cc.Sprite).spriteFrame = this.cardArr[0]
            }
        }
        this.scheduleOnce(()=>{
            this.view['msg_box/cardPos'].opacity = 255
            this.view['msg_box/cardPos'].x = -200
        },0.5)
    }).start()
   }

//    根据类型获得解释文本
   private getExplain(type:explainType):string{
       switch(type){
           case explainType.normal:return explainContent.normal;break;
           case explainType.add_2:return explainContent.add_2;break;
           case explainType.add_4:return explainContent.add_4;break;
           case explainType.ban:return explainContent.ban;break;
           case explainType.change_color:return explainContent.change_color;break;
           case explainType.turn:return explainContent.turn;break;
           case explainType.unoBtn:return explainContent.unoBtn;break;
   }
}

    // 更改卡牌
   public changeCard(){
       if(this.cardArr.length<=4){
            this.index++
       }else{
           this.index = Math.floor(Math.random()*this.cardArr.length)
       }
       if(this.index >= this.cardArr.length){
           this.index = 0
       }
       this.view['msg_box/cardPos/card'].getComponent(cc.Sprite).spriteFrame = this.cardArr[this.index]
   }

//    设置箭头状态
   private setArrowState(type:explainType){
    this.emit(ListenEventType.PLAY_EFFECT,AudioType.press_button)
        if(type === explainType.normal){
            this.view['msg_box/left_arrow'].active = false
        }else if(type === explainType.unoBtn){
            this.view['msg_box/right_arrow'].active = false
        }else{
            this.view['msg_box/left_arrow'].active = true
            this.view['msg_box/right_arrow'].active = true
        }
   }

//    获取卡牌
   public getCard(spriteFrame:cc.SpriteFrame[]){
        this.cardArr = spriteFrame
   }

//    设置选择的颜色
   private setSelectColor(color:BtnColor){
    this.emit(ListenEventType.PLAY_EFFECT,AudioType.press_button)
        this.emit(ListenEventType.POST_MODEL_SELECT_COLOR,color)
        this.closePanel()
   }

//    重新开始游戏
   private restartGame(){
    this.emit(ListenEventType.PLAY_EFFECT,AudioType.press_button)
        this.emit(ListenEventType.RESTART_GAME)
   }

//    关闭面板
   private closePanel(){
       this.node.destroy()
   }

   onDestroy(){
       this.off(ListenEventType.GET_CARD_SPRITEFRAME_BY_TYPE,this.getCard,this)
   }
}
